<template>
	<view class="examine-box">
		<view class="examinebox"></view>
		
		<view class="head">
			<view class="head-t">
				<view class="head-q">
					<view class="head-q-box">1</view>
					<view class="head-q-text">申请完成</view>
				</view>
				<view class="head-q">
					<view class="head-q-box">2</view>
					<view class="head-q-text">正在审核</view>
				</view>
				
				<view class="head-q" v-if="joingTrade.state==0">
					<view class="head-q-box">3</view>
					<view class="head-q-text">等待结果</view>
				</view>
				
				<view class="head-q" v-if="joingTrade.state==1">
					<view class="head-q-box">3</view>
					<view class="head-q-text">审核成功</view>
				</view>
				
				<view class="head-q" v-if="joingTrade.state==-1">
					<view class="head-q-box">3</view>
					<view class="head-q-text">审核失败</view>
				</view>
				
				<view class="head-x">
					<!-- <view class="head-xx"></view> -->
					<view class="head-max"></view>
				</view>
				<view class="semicircle-left"></view>
				<view class="semicircle-right"></view>
			</view>
		</view>
		
		  
		
		<view class="concent" v-if="joingTrade.state==-1">
			<image class="concent-img" src="../../static/images/my/auditing.png" mode=""></image>
			<view class="concent-text">失败原因</view>
			<view class="concent-text1">你的营业执照图片不符合规定，请点击进入修改</view>
			<button class="concent-button" type="default" @click="submits">进入修改</button>
		</view>
		
		<view class="concent" v-if="joingTrade.state==1">
			<image class="concent-img" src="../../static/images/my/auditing.png" mode=""></image>
			<view class="concent-text">审核通过</view>
			<view class="concent-text1">恭喜您，审核通过，正式成为商户啦！</view>
		</view>

	</view>
</template>

<script>
	export default {
		data() {
			return {
				joingTrade:{},
				rectificatlist: ''
			}
		},
		onShow() {
			this.inits();
		},
		methods:{
			inits(){
				let token = this.tui.getToken();
				let joiningTrader={
					token: token,
					type:1,
				};
				
				let joingTrade=this.tui.request('join','post',joiningTrader,1000,1,'','joinTradeDetail');
				Promise.resolve(joingTrade).then((value)=>{
				   if(value.code==200){
					this.joingTrade=value.data;
					if(this.joingTrade.state==0){
						setTimeout(()=>{
						     this.cg=true
						},3000)
					}
				   }else{
				   	
				   }
				})
			},
			submit() {
				uni.switchTab({
					url: "/pages/franchisee/shops"
				});
			},
			submits() {
				uni.navigateTo({
					url: "/pages/franchisee/apply"
				});
				
			},
		}
	}
</script>

<style>
	.examine-box{
		width: 100%;
		background: #FFFFFF;
		border-radius: 4rpx;
	}
	.examinebox{
		width: 100vh;
		height: 36rpx;
		background-color: #F5F5F5;
	}
	.head{
		width: 100%;
		border-bottom: 4rpx dashed #E9E9E9;
	}
	.head-t{
		position: relative;
		display: flex;
		justify-content: space-evenly;
		margin: 28rpx auto 56rpx;
		width: 100%;
		height: 196rpx;
	}
	.head-q{
		width: 128rpx;
		height: 100%;
		z-index: 1;
	}
	.head-q-box{
		margin: 60rpx auto 18rpx;
		width: 76rpx;
		height: 76rpx;
		border-radius: 50%;
		background: #FE5622;
		text-align: center;
		font-size: 18px;
		font-weight: 400;
		line-height: 76rpx;
		color: #FFFFFF;
	}
	.head-q-text{
		font-size: 16px;
		font-weight: 400;
		line-height: 21px;
		color: #333333;
	}
	.head-x{
		position: absolute;
		top: 90rpx;
		left: 176rpx;
		width: 400rpx;
		height: 10rpx;
		background: rgb(245,245,245);
	}
	.head-xx{
		width: 63%;
		height: 100%;
		background: #FE5622;
	}
	.head-max{
		width: 100%;
		height: 100%;
		background: #FE5622;
	}
	.semicircle-left{
		position: absolute;
		left: -20rpx;
		bottom: -80rpx;
		width: 40rpx;
		height: 40rpx;
		border-radius: 50%;
		background: rgb(245,245,245);
	}
	.semicircle-right{
		position: absolute;
		right: -20rpx;
		bottom: -80rpx;
		width: 40rpx;
		height: 40rpx;
		border-radius: 50%;
		background: rgb(245,245,245);
	}
	.concent{
		width: 100%;
		text-align: center;
	}
	.concent-img{
		margin-top: 46rpx;
		width: 356rpx;
		height: 232rpx;
	}
	.concent-text{
		margin-top: 40rpx;
		font-size: 40rpx;
		font-weight: 400;
		line-height: 52rpx;
		color: #333333;
	}
	.concent-text1{
		margin-top: 40rpx;
		font-size: 32rpx;
		font-family: Microsoft YaHei;
		font-weight: 400;
		line-height: 42rpx;
		color: #999999;
	}
	.concent-button{
		margin-top: 130rpx;
		width: 686rpx;
		height: 106rpx;
		background: #FE5622;
		border-radius: 54rpx;
		font-size: 36rpx;
		font-weight: bold;
		line-height: 106rpx;
		color: #FFFFFF;
	}
</style>
